<template>
  <div class="full-box padding-box shadow-box">
    <OperateCommon :showBack="true" @back="goBack"> </OperateCommon>
    <el-form
      :model="form"
      ref="form"
      :rules="rules"
      label-width="180px"
      :inline="false"
    >
      <div class="d-row">
        <el-form-item label="项目名称" prop="">
          <el-select
            style="width: 500px"
            v-model="form.project_name"
            value-key=""
            placeholder=""
            clearable
            filterable
            @change="projectChange"
          >
            <el-option
              v-for="item in project"
              :key="item.id"
              :label="item.project_name"
              :value="item"
              value-key="id"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="建设单位" prop="">
          <el-input
            style="width: 300px"
            v-model="form.dept"
            disabled
          ></el-input>
        </el-form-item>
        <el-form-item style="width: 100%" label="项目地址" prop="">
          <el-input
            v-model="form.address"
            placeholder=""
            clearable
            disabled
          ></el-input>
        </el-form-item>
      </div>
      <div class="d-row">
        <el-form-item label="总投资" prop="">
          <el-input-number
            v-model="form.investment"
            :step="1"
            :precision="2"
            :controls="true"
            controls-position="right"
            disabled
          >
          </el-input-number>
          （ 万元 ）
        </el-form-item>
      </div>
      <div class="d-row">
        <el-form-item class="d-textarea" label="建设内容与规模" prop="">
          <el-input
            type="textarea"
            v-model="form.content"
            placeholder=""
            clearable
            :autosize="{
              minRows: 5,
              maxRows: 10,
            }"
            disabled
          ></el-input>
        </el-form-item>
      </div>
      <div class="d-row">
        <el-form-item label="开工日期" prop="">
          <el-date-picker
            v-model="form.start_date"
            type="date"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            disabled
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="竣工验收日期" prop="">
          <el-date-picker
            v-model="form.reivew_date"
            type="date"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            disabled
          >
          </el-date-picker>
        </el-form-item>
      </div>
      <div class="d-row">
        <el-form-item label="附件（ 自评报告 ）" prop="files">
          <CommonUpload
            ref="upload"
            tableName="performanceSelfAssessment"
            useType="Self-Assessment-Report"
            :disabled="form.id == ''"
          ></CommonUpload>
        </el-form-item>
      </div>
      <div class="d-row">
        <el-form-item class="d-textarea" label="备注" prop="">
          <el-input
            type="textarea"
            v-model="form.remark"
            placeholder=""
            clearable
            :autosize="{
              minRows: 1,
              maxRows: 5,
            }"
          ></el-input>
        </el-form-item>
      </div>
      <div>
        <el-form-item label="">
          <!-- <el-button type="info" @click="save(0)">暂存</el-button> -->
          <el-button type="primary" @click="save(10)">提交</el-button>
        </el-form-item>
      </div>
    </el-form>
  </div>
</template>

<script>
import CommonUpload from "@/components/Common/CommonUpload.vue";
import {
  getPerformanceSelfAssessmentProjectList,
  postPerformanceSelfAssessmentSave,
} from "@/api/WorkCollection/Index";
import OperateCommon from "@/components/Common/OperateCommon.vue";
import uploadMixin from "@/components/GenerateForm/uploadMixin";
export default {
  name: "AssessmentForm",
  mixins: [uploadMixin],
  components: { CommonUpload, OperateCommon },
  data() {
    return {
      form: {
        id: "",
        project_name: "",
        dept: "",
        address: "",
        investment: undefined,
        start_date: "",
        reivew_date: "",
        content: "",
        remark: "",
      },
      rules: {},
      project: [],
      files: 0,
    };
  },
  methods: {
    initData() {
      getPerformanceSelfAssessmentProjectList().then((res) => {
        if (res.code == 0) {
          this.project = res.data;
        }
      });
    },
    save(status) {
      if (this.form.id == 0) {
        this.$message.error("请先选择项目");
        return;
      }
      // if (status == 0) {
      //   postPerformanceSelfAssessmentSave({
      //     project_id: this.form.id,
      //     remark: this.form.remark,
      //     status: 0,
      //     status_text: "暂存",
      //   }).then((res) => {
      //     if (res.code == 0) {
      //       this.$message.success("暂存成功");
      //       this.$emit("refresh");
      //     }
      //   });
      // }
      if (status == 10) {
        if (this.$store.state.files.unBindFiles == 0) {
          this.$message.error("请先上传自评报告！");
          return;
        }
        postPerformanceSelfAssessmentSave({
          project_id: this.form.id,
          remark: this.form.remark,
          status: 10,
          status_text: "待审核",
        }).then((res) => {
          if (res.code == 0) {
            this.$message.success("提交成功");
            this.checkFile(res.data);
            this.goBack();
          }
        });
      }
    },
    projectChange(item) {
      this.form.id = item.id || 0;
      this.form.dept = item.owner_name;
      this.form.address = item.project_address;
      this.form.investment = item.investment;
      this.form.content = item.project_content;
      this.form.start_date = item.fact_start_date;
      this.form.reivew_date = item.accept_date;
    },
    goBack() {
      this.$router.push(`/workCollectionPerformanceSelfAssessment`);
    },
  },
  created() {
    this.initData();
  },
  mounted() {
  },
};
</script>

<style lang="scss" scoped>
:deep(.el-form-item__label) {
  color: #000;
}
.d-model {
  margin-bottom: 10px;
  font-weight: 600;
}
.d-row {
  margin: 20px 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  border-bottom: 1px solid #eee;
  :deep(.el-form-item) {
    margin-bottom: 20px;
  }
}
.d-row-child {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.d-textarea {
  width: 100%;
  margin: 0 auto;
}
</style>